<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title th:text="${#servletContext.getAttribute('applicationOptionsMap').websiteTitle} + '&nbsp;|&nbsp;Tag-Mgr'"></title>
	<link rel="shortcut icon" th:href="${#servletContext.getAttribute('applicationOptionsMap').websiteIco}">
	<link rel="apple-touch-icon" th:href="${#servletContext.getAttribute('applicationOptionsMap').websiteIco}">
	<!-- Tell the browser to be responsive to screen width -->
	<meta name="viewport" content="width=device-width, initial-scale=1">

	<link rel="stylesheet" th:href="@{/plugins/selectize/css/selectize.bootstrap3.css}">

	<!-- Theme style -->
	<link rel="stylesheet" th:href="@{/css/adminlte.min.css}">
	<!-- Font Awesome -->
	<link rel="stylesheet" th:href="@{/plugins/fontawesome-free/css/all.min.css}">

</head>
<body class="hold-transition sidebar-mini layout-fixed">
<div class="wrapper">
	<!-- Navbar -->
	<nav class="main-header navbar navbar-expand navbar-white navbar-light">
		<!-- Left navbar links -->
		<ul class="navbar-nav">
			<li class="nav-item">
				<a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fa fa-bars"></i></a>
			</li>
		</ul>

		<!-- Right navbar links -->
		<ul class="navbar-nav ml-auto">
			<!-- Messages Dropdown Menu -->
			<li class="nav-item dropdown">
				<a class="nav-link" target="_blank" href="/index">
					<i class="fa fa-paper-plane"></i>
					<span>博客前台首页</span>
				</a>
			</li>
		</ul>
	</nav>
	<!-- /.navbar -->

	<!-- Main Sidebar Container -->
	<aside class="main-sidebar sidebar-dark-primary elevation-4">
		<!-- Brand Logo -->
		<h1>
			<a href="/admin" class="brand-link">
				<img th:src="${#servletContext.getAttribute('applicationOptionsMap').avatar}" class="brand-image img-circle elevation-3">
				<span class="brand-text font-weight-light" th:text="${#servletContext.getAttribute('applicationOptionsMap').websiteTitle}">websiteTitle</span>
			</a>
		</h1>

		<!-- Sidebar -->
		<div class="sidebar">
			<!-- Sidebar Menu -->
			<nav class="mt-2">
				<ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
					<!-- Add icons to the links using the .nav-icon class
						 with font-awesome or any other icon font library -->
					<li class="nav-header">仪表盘</li>
					<li class="nav-item">
						<a href="/admin" class="nav-link">
							<i class="nav-icon fas fa-tachometer-alt"></i>
							<p>仪表盘</p>
						</a>
					</li>
					<li class="nav-header">博客编辑</li>
					<li class="nav-item">
						<a href="/adminEdit" class="nav-link">
							<i class="nav-icon fas fa-edit"></i>
							<p>发布博客</p>
						</a>
					</li>
					<li class="nav-header">管理模块</li>
					<li class="nav-item">
						<a href="adminBlog" class="nav-link">
							<i class="fa fa-list-alt nav-icon"></i>
							<p>博客管理</p>
						</a>
					</li>
					<li class="nav-item">
						<a href="/adminCategory" class="nav-link">
							<i class="fa fa-bookmark nav-icon"></i>
							<p>分类管理</p>
						</a>
					</li>
					<li class="nav-item">
						<a href="/adminTag" class="nav-link active">
							<i class="fa fa-tags nav-icon"></i>
							<p>标签管理</p>
						</a>
					</li>
					<li class="nav-item">
						<a href="/adminComment" class="nav-link">
							<i class="fa fa-comments nav-icon"></i>
							<p>评论管理</p>
						</a>
					</li>
					<li class="nav-item">
						<a href="/adminUser" class="nav-link">
							<i class="fa fa-user nav-icon" aria-hidden="true"></i>
							<p>用户管理</p>
						</a>
					</li>
					<li class="nav-item">
						<a href="/adminFile" class="nav-link">
							<i class="fa fa-file-code nav-icon" aria-hidden="true"></i>
							<p>文件管理</p>
						</a>
					</li>
					<li class="nav-header">系统管理</li>
					<li class="nav-item">
						<a href="/adminConfig"
						   class="nav-link">
							<i class="fa fa-wrench nav-icon"></i>
							<p>系统配置</p>
						</a>
					</li>
					<li class="nav-item">
						<a href="/logout" class="nav-link">
							<i class="fa fa-sign-out-alt nav-icon"></i>
							<p>安全退出</p>
						</a>
					</li>
				</ul>
			</nav>
			<!-- /.sidebar-menu -->
		</div>
		<!-- /.sidebar -->
	</aside>

	<!-- Content Wrapper. Contains page content -->
	<div class="content-wrapper mt-3">
		<!-- Main content -->
		<section class="content">
			<div class="container-fluid">
				<!-- /.col -->
				<div class="col-12">
					<div class="card card-teal card-outline">
						<div class="card-header">
							<h3 class="card-title">标签列表</h3>
						</div>
						<!-- /.card-header -->
						<div class="card-body table-responsive p-0">
							<table class="table table-hover text-nowrap table-bordered">
								<thead>
								<tr>
									<th width="5%"></th>
									<th>标签名称</th>
									<th>文章数量</th>
									<th class="text-center" width="15%">
										操作
									</th>
								</tr>
								</thead>
								<tbody>
								<tr th:each="tag,arrayS:${tags}">
									<td class="text-center" th:text="${arrayS.index + 1}"></td>
									<td th:text="${tag.name}"></td>
									<td th:text="${tag.count}"></td>
									<td class="text-center">
										<button th:if="${session.USER_SESSION.role eq 'administrator'}" class="btn btn-xs btn-success" data-toggle="modal" data-target="#updateTagModal" th:onclick="valuesToInput([[${tag.tid}]],[[${tag.name}]])">
											<i class="fa fa-edit"></i>
											修改
										</button>
										<button th:if="${session.USER_SESSION.role ne 'administrator'}" class="btn btn-xs btn-success disabled">
											<i class="fa fa-edit"></i>
											修改
										</button>
										<button th:if="${session.USER_SESSION.role eq 'administrator'}" class="btn btn-xs btn-danger ml-2" data-toggle="modal" data-target="#deleteTagModal" th:onclick="deleteTag([[${tag.tid}]])">
											<i class="fa fa-trash"></i>
											删除
										</button>
										<button th:if="${session.USER_SESSION.role ne 'administrator'}" class="btn btn-xs btn-danger ml-2 disabled">
											<i class="fa fa-trash"></i>
											删除
										</button>
									</td>
								</tr>
								</tbody>
							</table>
						</div>
						<!-- /.card-body -->
					</div>
					<!-- /.card -->
				</div>
			</div>
			<!-- /.row -->
		</section>
		<!-- /.content -->
	</div>
	<!-- /.content-wrapper -->
	<footer class="main-footer">
		<p class="text-center mb-1">
			Copyright © 2020-2021 | THE HARDER, THE MORE FORTUNATE.
		</p>
		<p class="text-center mb-1" th:if="!${#strings.isEmpty(#servletContext.getAttribute('applicationOptionsMap').icp)}">
			<a href="https://beian.miit.gov.cn/" th:text="${#servletContext.getAttribute('applicationOptionsMap').icp}"></a>
		</p>
	</footer>
</div>
<!-- ./wrapper -->
<div class="modal fade" id="updateTagModal">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">修改标签</h4>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
			</div>
			<div class="modal-body">
				<input class="form-control" type="hidden" id="valueOfTag">
				<input class="form-control" type="text" id="updateName" name="tag" value="前端">
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
				<button id="updateTagBtn" type="button" class="btn btn-success">修改</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div>

<div class="modal fade" id="deleteTagModal">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">删除标签</h4>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
			</div>
			<div class="modal-body">
				<p class="m-0">你确定要删除吗？</p>
			</div>
			<div class="modal-footer">
				<input type="hidden" id="valueOfTag2">
				<button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
				<button id="deleteTagBtn" type="button" class="btn btn-danger">删除</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div>
<!-- jQuery -->
<script th:src="@{/plugins/jquery/jquery.min.js}"></script>
<!-- Bootstrap 4 -->
<script th:src="@{/plugins/bootstrap/js/bootstrap.bundle.min.js}"></script>

<script th:src="@{/plugins/selectize/js/standalone/selectize.min.js}"></script>


<!-- AdminLTE App -->
<script th:src="@{/js/adminlte.min.js}"></script>

<script>
	function deleteTag(cgid) {
		$('#valueOfTag2').val(cgid);
	}

	$('#deleteTagBtn').click(function () {
		var valueOfTag = $('#valueOfTag2').val();
		$.ajax({
			url: '/deleteTag',
			type: 'post',
			data:{'tid':valueOfTag},
			success: function(res) {
				// alert(res.data)
				$('#deleteTagModal').modal('hide');
				location.href = '/adminTag'
			},
			error: function() {
				alert("系统错误")
			}
		});
	})

	function valuesToInput(tid,name) {
		$('#valueOfTag').val(tid);
		$('#updateName').val(name);
	}

	$('#updateTagBtn').click(function () {
		var valueOfTag = $('#valueOfTag').val();
		var updateName = $('#updateName').val();
		if (valueOfTag === "" || updateName === "") {
			alert("你好像忘记输入什么了");
		} else {
			$.ajax({
				url: '/updateTag',
				type: 'post',
				data:{'tid':valueOfTag,'name':updateName},
				success: function(res) {
					// alert(res.data)
					$('#updateTagModal').modal('hide');
					location.href = '/adminTag'
				},
				error: function() {
					alert("系统错误")
				}
			});
		}
	})
</script>

</body>
</html>
